import React, { Component } from 'react';
import { Form, Select, Input, Modal } from 'antd';
import Tips from '../../Tips/index';
import { connect } from 'react-redux';
import statuscode from '../../statuscode/index';
const FormItem = Form.Item;
const Option = Select.Option;
const { TextArea } = Input;

let uuid = 0;
const Token = localStorage.getItem('token');
class useTemplate extends Component {
  constructor(props) {
    super(props);
    this.state = {
      installnetwork: '',
      message: '',
      inputdata: [],
      networkdata: [],
    };
  }
  tips = (str) => {
    this.setState({
      message: str
    });
    setTimeout(() => {
      this.setState({
        message: ''
      });
    }, 1000);
  }
  installnetwork = (ev) => {
    this.setState({ installnetwork: ev });
  }
  changeNetwork = (ev) => {
    this.props.dispatch({
      type: 'changenetwork',
      network: ev
    });
  }
  handleSubmit = (e) => {
    e.preventDefault();
    this.props.form.validateFields((err, values) => {
      if (!err) {
        if (!this.props.changeNetwork) {
          this.tips('暂无网络！');
        } else {
          this.props.onCreate(values.ChainCodeName);
        }
      }
    });
  }
  render() {
    const { visible, onCancel } = this.props;
    const { getFieldDecorator } = this.props.form;
    let changeNetwork = this.props.changeNetwork;
    var networklist = '';
    const _this = this;
    if (this.props.organdnet && this.props.organdnet.net && this.props.organdnet.net.length !== 0) {
      networklist = this.props.organdnet.net.map((e, i) => {
        return <Option key={i} value={e.networkName} >{e.nickname}</Option>;
      });
    } else {
      changeNetwork = '暂无网络';
      networklist = (<Option disabled value="暂无网络" >暂无网络</Option>);
    }
    return <div>
      <Modal visible={visible} title="从模板安装Chaincode" closable={false} onCancel={onCancel} okText="立即提交" cancelText="取消" onCancel={onCancel} onOk={this.handleSubmit} confirmLoading={this.props.timeout} destroyOnClose={true}>
        <Form>
          <FormItem
            label="模板"
            labelCol={{ span: 6 }}
            wrapperCol={{ span: 16 }}
          >
            <Input value={this.props.templatedetail['模板名称']} disabled />
          </FormItem>
          <FormItem
            label="模板描述"
            labelCol={{ span: 6 }}
            wrapperCol={{ span: 16 }}
          >
            <TextArea rows={4} value={this.props.templatedetail['描述']} disabled />
          </FormItem>
          <FormItem label="网络" labelCol={{ span: 6 }} wrapperCol={{ span: 16 }}>
            <Select value={changeNetwork} onChange={this.changeNetwork}>
              {networklist}
            </Select>
          </FormItem>
          <FormItem label="Name" labelCol={{ span: 6 }} wrapperCol={{ span: 16 }}>
            {getFieldDecorator('ChainCodeName', {
              rules: [
                { required: true, message: '请输入ChaincodeName' }
              ]
            })(<Input placeholder="请输入ChaincodeName" />)}
          </FormItem>
        </Form>
      </Modal>
      <Tips message={this.state.message} />
    </div>;
  }
}
const UseTemplate = Form.create()(useTemplate);
export default connect((state) => {
  return { ...state };
})(UseTemplate);
